<template>
<div class="echarts-api-content">
  <div v-if="!loading">
    <item v-for="(item,index) in data" :key="index" :info="item" :index="index+''" :parent-name="item.name||''" ></item>
  </div>
</div>
</template>

<script>
import {api, option} from "@/utils/file";

export default {
  name: "index",
  components:{
    item:()=>import('@/components/item/item')
  },
  props: {
    optionType: {
      type: String,
      default: "",
    },
  },
  data(){
    return{
      data:[],
      loading:false
    }
  },
  inject:['parentInit'],
  created() {

  },
  mounted() {
    this.parentInit()
  },
  methods:{
    init(key){
      this.loading=true
      let optionData = []
      if(this.optionType==='option'){
        optionData=option
      }else if(this.optionType === 'api'){
        optionData=[{children:api}]
      }else if(this.optionType==='gloption'){

      }

      console.log(optionData,'optionData')
      console.log(key)
      let data  =[optionData[0].children.find(item=>item.id === key)]
      this.data = data
      console.log(this.data,'this.data')
      let timer= setTimeout(()=>{
        this.loading=false
        clearTimeout(timer)
      },1000)
    }
  }
}
</script>

<style scoped>

</style>
